<template>
	<view class="lev">
		
		<uni-section title="积分兑换" type="line" padding>
			<u-grid :border="false" col="3" class="cart" >
				<u-grid-item v-for="listItem in produclist" :key="listItem.id" @click="getexchange(listItem)">
					 <u-icon name="coupon" color="#2979ff" size="28"></u-icon>
					<text class="grid-text">{{listItem.name}}</text>
				 </u-grid-item>
			</u-grid>
		</uni-section>
		
		<uni-section title="积分等级" type="line" padding>
			<u-grid :border="false" col="3"  >
				<u-grid-item v-for="listItem in lvelist" :key="listItem.id" >
					 <u-icon name="star-fill" color="#2979ff" size="28"></u-icon>
					<text class="grid-text">{{listItem.name}}</text>
				 </u-grid-item>
			</u-grid>
		</uni-section>	
		
		<uni-section title="积分变动" type="line" padding>
			<view class="levchange"  v-for="item in lvllist" :key="item.id">
				<text>{{item.event}}</text>
				<text>{{item.type}}积分</text>
				<text>{{item.score}}</text>
			</view>
		</uni-section>
	</view>
</template>

<script setup>
import {getlevel,getproduct,getlevlist,goconsume,gettop} from '@/api/parkApi.js'
import { onMounted, ref } from 'vue';
import {chlvl,lvlji,lvldong} from '@/mock/park.js'

const produclist = ref([])  //换购列表
const lvllist=ref([])      //积分列表
const lvelist=ref([])     //积分等级

//点击兑换加油卡
const getexchange=async(val)=>{
 //       uni.showToast({
 //    		title:'兑换成功'
 //    	   })

	// let last={
	// 	type: "扣除",
	// 	event: "兑换商品",
	// 	score: -val.score
	// }
	// lvllist.value.push(last)
	// console.log(lvllist.value);
	console.log(val);
	
	let res = await goconsume({
		header:{
			"Authorization":uni.getStorageSync('token')
		},
		productId:val.id
     })
	   if(res.code==200){
	    	uni.showToast({
			title:'兑换成功'
		   })
		
	      let last={
		   type: "扣除",
		  event: "兑换商品",
		  score: -produclist[index].score
	    }
	   lvllist.value.push(last)
	  
	}else{
		//模拟数据
		      uni.showToast({
		   		title:'兑换成功'
		   	   })
		
			let last={
				type: "扣除",
				event: "兑换商品",
				score: -val.score
			}
			
			lvllist.value.push(last)
		
		
	}
	console.log(lvllist.value);
	
}

//获取换购商品信息
const getproductdata=async()=>{
	let res = await getproduct({})

	if(res.code==200){
		produclist.value=res.rows.sort((a,b)=>a.price-b.price)
	}else{
		//模拟数据
		produclist.value=chlvl()
	}
	console.log(produclist.value);
}	

//积分等级
const getlvl=async()=>{
	let res=await getlevlist({
		header:{
			"Authorization":uni.getStorageSync('token')
		}
	})
	if(res.code==200){
		lvelist.value=res.rows
	}else{
		//模拟数据
		lvelist.value=lvlji()
		
	}
	console.log(lvelist.value);
}

//积分变动
const getlevdata=async()=>{
	let res = await getlevel({
		header:{
			"Authorization":uni.getStorageSync('token')
		},
		data:{
			pageNum:1,
			pageSize:10
		}
	})
	if(res.code==200){
		lvllist.value=res.rows
	}else{
		//模拟数据
		
		lvllist.value=lvldong()
	}
	console.log(lvllist.value);
}

onMounted(()=>{
	getlevdata()
	getproductdata()
	getlvl()

})
</script>
<style lang="scss">
.lev{
	
	.cart{
		cursor: pointer;
	}
	.levchange{
		display: flex;
		font-size: 16px;
		color: #5b5b5b;
		
		text{
		 line-height: 28px;
		 margin-right: 4px;
		}
		
	}
}
</style>
